import React, { useEffect, useState } from 'react'
import { connect } from 'dva';

const theProps = (state) => {
    return {
        mapsInfo: state.maps.mapsInfo[0],
        resImageUrl: state.maps?.mapsInfo[0]?.mapsRes1[0]?.path,
        contrastIframe: state.taskmanage.contrastIframe,
        id:state.maps.mapsId
    }
}


function OutCome(props) {
    const { mapsInfo, dispatch, contrastIframe,id } = props;
    useEffect(() => {
        dispatch({
            type: 'taskmanage/mapsContrast',
            payload: id
        })
    }, [dispatch, id, mapsInfo]);

    return (
        <>
            <div
                style={{
                    height: "60vh",
                    minWidth: '70vw'
                }}
            >
                <iframe
                    title="resg"
                    style={{
                        border: '0px', marginTop: '10vh', height: "100%",
                        width: "100%"
                    }}
                    sandbox="allow-same-origin allow-scripts allow-popups allow-forms"
                    scrolling="auto"
                    allowfullscreen="true"
                    src={contrastIframe} 
                />

            </div>
        </>
    )
}
export default connect(theProps, null)(OutCome)
